<template>
  <a-config-provider :locale="locale">
    <div class="layout-body">
      <div class="layout-body-hd">
        <Head />
      </div>
      <div class="layout-body-bd">
        <router-view />
      </div>
    </div>
    <AddKanban />
    <LoginDisplay />
  </a-config-provider>
</template>

<script lang="ts">
  import { defineComponent } from 'vue';
  import Head from './components/menu/head.vue';
  import zhCN from 'ant-design-vue/es/locale/zh_CN';
  import AddKanban from './views/dashboard/_source/addKanban.vue';
  import LoginDisplay from './components/common/login.vue';

  export default defineComponent({
    components: { Head, AddKanban, LoginDisplay },
    data() {
      return {
        locale: zhCN,
      };
    },
  });
</script>
<style lang="scss">
  .layout-body {
    background-color: #f5f6f8;
    min-height: 100%;
    .layout-body-hd {
      height: 54px;
      width: 100%;
      position: fixed;
      box-shadow: 0 2px 8px #f0f1f2;
      background-color: #fff;
      z-index: 10;
    }
    .layout-body-bd {
      padding-top: 54px;
    }
  }
</style>
